<%--
  Created by IntelliJ IDEA.
  User: cnc
  Date: 2017-07-04
  Time: 14:28
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/upload/css/font-awesome.min.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/blogAdmin/upload/css/amazeui.min.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/blogAdmin/upload/css/amazeui.cropper.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/blogAdmin/upload/css/custom_up_img.css">
  <style type="text/css">
    .up-img-cover {width: 100px;height: 100px;}
    .up-img-cover img{width: 100%;}
  </style>
</head>
<body>
<jsp:include page="../head.jsp"/>
<div class="col-md-6 col-lg-4" style="position: absolute;z-index:999;top:90px;left:20px;">
  <div>
    <div class="profile-photo">
      <div class="up-img-cover" id="up-img-touch">
        <img class="am-circle" alt="点击图片上传" src="" data-am-popover="{content: &#39;点击上传&#39;, trigger: &#39;hover focus&#39;}">
      </div>
    </div>
    <div class="user-header-info" style="width: 50%;">
      <h2 class="user-name" ><input type="text" id="user-name" style="border-style:none;width: 40%;background-color: transparent"readonly ></h2>
      <h5 class="user-position" ><input type="text" id="job" style="border-style:none;width: 65px;background-color: transparent"readonly ></h5>
    </div>
    <div style="float: right;">
      <div id="editorUser" class="btn btn-primary">编辑</div>
    </div>
  </div>
  <div class="panel bg-scale-0 b-primary bt-sm mt-xl">
    <div class="panel-content">
      <h4 class=""><b>详细信息</b></h4>
      <ul class="user-contact-info ph-sm">
        <li ><b><i class="color-primary mr-sm fa fa-envelope"></i></b><input type="text" id="userInfoEmail" style="border-style:none;width: 90%;background-color: transparent" readonly></li>
        <li ><b><i class="color-primary mr-sm fa fa-phone"></i></b><input type="text"id="mobilePhone" style="border-style:none;width: 90%;background-color: transparent" readonly></li>
        <li class="mt-sm">个人介绍:<input type="textarea"id="introduce" style="  border-style:none;background-color: transparent;width: 90%;height: 60px;" readonly></li>
      </ul>
    </div>
  </div>
</div>
<!--图片上传框-->
<div class="am-modal am-modal-no-btn up-frame-bj am-modal-out" tabindex="-1" id="doc-modal-1" style="display: none;">
  <div class="am-modal-dialog up-frame-parent up-frame-radius" style="width: 600px;">
    <div class="am-modal-hd up-frame-header">
      <label>修改头像</label>
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close="">×</a>
    </div>
    <div class="am-modal-bd  up-frame-body">
      <div class="am-g am-fl">
        <div class="am-form-group am-form-file">
          <div class="am-fl">
            <button type="button" class="am-btn am-btn-default am-btn-sm">
              <i class="am-icon-cloud-upload"></i> 选择要上传的文件</button>
          </div>
          <input type="file" id="inputImage">
        </div>
      </div>
      <div class="am-g am-fl">
        <div class="up-pre-before up-frame-radius">
          <img alt="" id="image" class="cropper-hidden">
        </div>
        <div class="up-pre-after up-frame-radius" style="width: 164px; height: 164px;"><img  style="display: block; width: 316.577px; height: 176.995px; min-width: 0px !important; min-height: 0px !important; max-width: none !important; max-height: none !important; margin-left: -86.5162px; margin-top: -5.52349px; transform: none;"></div>
      </div>
      <div class="am-g am-fl">
        <div class="up-control-btns">
          <span class="am-icon-rotate-left" onclick="rotateimgleft()"></span>
          <span class="am-icon-rotate-right" onclick="rotateimgright()"></span>
          <span class="am-icon-check" id="up-btn-ok" url="/user/uploadImg"></span>
        </div>
      </div>

    </div>
  </div>
</div>

<!--加载框-->
<div class="am-modal am-modal-loading am-modal-no-btn am-modal-out" tabindex="-1" id="my-modal-loading" style="display: none;">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">正在上传...</div>
    <div class="am-modal-bd">
      <span class="am-icon-spinner am-icon-spin"></span>
    </div>
  </div>
</div>

<!--警告框-->
<div class="am-modal am-modal-alert am-modal-out" tabindex="-1" id="my-alert" style="display: none;">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">信息</div>
    <div class="am-modal-bd" id="alert_content">上传文件失败了！</div>
    <div class="am-modal-footer">
      <span class="am-modal-btn">确定</span>
    </div>
  </div>
</div>


<div class="am-popover am-popover-bottom" id="am-popover-8frxq" style="top: 110px; left: 9px; display: none;">
  <div class="am-popover-inner">点击上传</div>
  <div class="am-popover-caret"></div>
</div>
<div class="am-dimmer" data-am-dimmer="" style="display: none;"></div>
<jsp:include page="../footer.jsp"/>
</body>
<script src="${pageContext.request.contextPath}/static/blogAdmin/upload/js/amazeui.min.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath}/static/blogAdmin/upload/js/cropper.min.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath}/static/blogAdmin/upload/js/custom_up_img.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath}/static/blogAdmin/sys/js/auth/user_info.js"></script>
</html>
